<!--
* @author wn
* @date 2023/03/07 13:28:54
* @description: 主页 menu左上角 logo
!-->
<template>
	<div class="logo">
		<router-link :to="routerLinkTo">
			<!-- logo颜色根据主题颜色变化 -->
			<img
				v-if="navTheme === 'dark'"
				src="~@/assets/logo_186_king-white.png"
				alt="logo"
			/>
			<!-- TODO 暂时同一张 后期替换 -->
			<img v-else src="~@/assets/logo_186_king-white.png" alt="logo" />

			<h1 v-if="showTitle">{{ title }}</h1>
		</router-link>
	</div>
</template>
<script setup>
defineProps({
	title: {
		type: String,
		default: '',
		required: false,
	},
	showTitle: {
		type: Boolean,
		default: true,
		required: false,
	},
	// 点击Logo跳转地址
	routerLinkTo: {
		type: [String, Object],
		default: '',
	},
})
</script>
<style scoped lang="less">
/*缩小首页布 局顶部的高度*/
@height: 59px;
@primary-color: #1890ff;

.logo {
	display: flex;
	height: @height !important;
	line-height: @height !important;
	justify-content: center;
	box-shadow: none !important;
	background-color: @primary-color;
	transition: background 300ms;
	img {
		height: 32px;
	}
	a {
		color: white;
		&:hover {
			color: rgba(255, 255, 255, 0.8);
		}
	}
}
</style>
